<template>
  <div>
    <el-dialog
      width="90%"
      title="User Battery Swap Records"
      :visible.sync="show"
      :destroy-on-close="true"
      @close="closeFn"
    >
      <r-table
        :isPagination="true"
        :isHandle="true"
        :tableData="tableData"
        :tableCols="tableCols"
        :tablePage="pagination"
        :loading="tableLoading"
        :tableHandles="tableHandles"
        :isSelection="false"
      />
    </el-dialog>
  </div>
</template>

<script>
export default {
  name: "Abnormal_record",
  data() {
    return {
      show: false,
      row: {},
      tableLoading: false,
      tableData: [],
      // tableCols: [
      //   { label: "Order Number", prop: "orderNo", },
      //   { label: "Package Name", prop: "mealName", },
      //   { label: "PackageMoney", prop: "mealMoney", formatter: e => (e.mealMoney ? e.mealMoney + '元' : '0元') },
      //   { label: "Overdue Amount", prop: "overduePay", formatter: e => (e.overduePay ? e.overduePay + '元' : '0元') },
      //   { label: "BatteryDeposit", prop: "deposit", formatter: e => (e.deposit ? e.deposit + '元' : '0元') },
      //   { label: "ResidueNumber of Battery Swaps", prop: "mealRestNum", formatter: e => (e.mealRestNum ? e.mealRestNum + '次' : '0次') },
      //   { label: "New Battery Number", prop: "newBatteryNo", },
      //   { label: "Old Battery Number", prop: "oldBatteryNo", },
      //   { label: "Username", prop: "userName", },
      //   { label: "UserPhone", prop: "phone", },
      //   {
      //     label: "订单Status", prop: "status",
      //     itemClass: e => (e.status == 3 ? 'danger' : ''),
      //     formatter: e => (e.status == 0 ? '进行中' : e.status == 1 ? 'Completed' : e.status == 2 ? 'Overdue' : e.status == 3 ? '订单已Cancel' : '--')
      //   },
      //   {
      //     label: "Business Type", prop: "openType",
      //     formatter: e => (e.openType == 1 ? '租电' : e.openType == 2 ? 'Return Battery' : e.openType == 3 ? '管理员开门' : '--')
      //   },
      //   {
      //     label: "Cabinet Opening Result", prop: "openResult",
      //     itemClass: e => (e.openResult == 0 ? 'danger' : 'success'),
      //     formatter: e => (e.openResult == 0 ? 'Failure' : e.openResult == 1 ? 'Success' : '--')
      //   },
      //   {
      //     label: "BatteryStatus", prop: "btStatus",
      //     type: 'html',
      //     html: (row) => {
      //       let html = '<p>' +
      //         (row.btStatus == 0 ? "租借中" :
      //           row.btStatus == 1 ? "已Return" :
      //             row.btStatus == 2 ? "Not Returned" : row.btStatus == 3 ? "非法Battery" : row.btStatus == 4 ? "Battery不匹配" : "--")
      //         + '</p>'
      //       return html
      //     }
      //   },

      //   { label: "Start Time", prop: "ctime", },
      //   { label: "Completion Time", prop: "ftime", },

      // ],
      tableHandles: [],
      pagination: { limit: 10, offset: 1, total: 1 },
      tableCols: [
        { label: "Username", prop: "userName" },
        {
          label: " User Type",
          prop: "userType",
          formatter: e =>
            e.userType == 1
              ? "WeChatUser"
              : e.userType == 2
              ? "AlipayUser"
              : e.userType == 3
              ? "Maintenance"
              : "--"
        },
        { label: "Phone", prop: "phone" },
        { label: "Order Number", prop: "orderNo" },
        {
          label: "Business Type",
          prop: "oprType",
          formatter: e =>
            e.oprType == 0
              ? "管理员开门"
              : e.oprType == 1
              ? "租Battery"
              : e.oprType == 2
              ? "Battery Swap"
              : e.oprType == 3
              ? "寄存Battery"
              : e.oprType == 4
              ? "Deposit退电"
              : "--"
        },
        { label: "Old Battery Number", prop: "returnBatteryNo" },
        { label: "New Battery Number", prop: "batteryNo" },
        {
          label: "Status",
          prop: "statusStr",
          itemClass: e =>
            e.statusStr == "仓门打开Failure" ||
            e.returnStatusStr == "仓门打开Failure" ||
            e.statusStr == "未领取Battery" ||
            e.returnStatusStr == "Not ReturnedBattery"
              ? "danger"
              : e.statusStr && e.statusStr == "Success"
              ? "success"
              : e.returnStatusStr && e.returnStatusStr == "Success"
              ? "success"
              : "",
          formatter: e =>
            e.statusStr
              ? e.statusStr
              : e.returnStatusStr
              ? e.returnStatusStr
              : "--"
        },
        { label: "Swap Cabinet Number", prop: "deviceNo" },
        { label: "Start Time", prop: "ctime" },
        { label: "Completion Time", prop: "ftime" }
      ]
    };
  },
  watch: {
    "pagination.offset": {
      handler(newValue) {
        if (newValue) {
          this.getData();
        }
      },
      deep: true // 深度监听
    },
    "pagination.limit": {
      handler(newValue) {
        if (newValue) {
          this.getData();
        }
      },
      deep: true // 深度监听
    }
  },

  methods: {
    closeFn() {
      this.show = false;
    },
    async getData(num, size) {
      // var res = await this.apis.orderExchange_list({
      //   userId: this.row.userId,
      //   // userId: '1000001511056977',
      //   orderNo: '',
      //   sn: '',
      //   phone: '',
      //   newBatteryNo: '',
      //   beginTime: '',
      //   endTime: '',
      //   pageNum: num || this.pagination.offset,
      //   pageSize: size || this.pagination.limit,
      // });

      let parm = {
        userId: this.row.userId,
        deviceType: "",
        sn: "",
        oprType: "",
        result: "",
        phone: "",
        orderNo: "",
        pageNum: num || this.pagination.offset,
        pageSize: size || this.pagination.limit
      };
      let res = await this.apis.deviceLog_list(parm);

      const list = res.rows || [];
      this.tableData = list;
      this.pagination.total = res.total;
    },
    del(row) {
      this.$confirm("Confirm要Delete吗?", "Hint", {
        confirmButtonText: "Confirm",
        cancelButtonText: "Cancel",
        type: "warning"
      })
        .then(async () => {
          const res = await this.apis.alarm_del({
            id: row.id
          });

          this.$message({
            type: "success",
            message: "DeleteSuccess!"
          });
        })
        .catch(() => {});
    },
    show_fun(row) {
      console.log(222, row);
      this.row = row;
      this.show = true;
      this.getData();
    }
  }
};
</script>

<style scoped lang="scss"></style>
